<template>
  <!-- 生成合同页面 -->
  <div class="generate-contract">
    <div class="step">
      <t-steps :current="current" :steps="steps" />
    </div>
    <div class="order">
      <keep-alive>
        <t-order v-if="current == 0" @onStepChange="onStepChange"
      /></keep-alive>
    </div>
    <div class="verifyGoods">
      <keep-alive
        :include="isKeepAlive ? 'VerifyGoods' : ''"
        :exclude="isKeepAlive ? '' : 'VerifyGoods'"
      >
        <v-goods v-if="current == 1" @onStepChange="onStepChange"
      /></keep-alive>
    </div>
    <div class="priewContract">
      <p-contract
        :datas="datas"
        :imgFileList="imgFileList"
        :pages="'contractPage'"
        v-if="current == 2"
        @onStepChange="onStepChange"
      />
    </div>
    <div class="result-page">
      <result-page
        :datas="datas"
        :pages="'contractPage'"
        v-if="current == 3"
        :title="'成功生成合同'"
        @onStepChange="onStepChange"
      />
    </div>
  </div>
</template>
<script>
import tSteps from "../components/steps";
import tOrder from "../components/associated-order";
import vGoods from "./verify-goods";
import pContract from "../components/preview-contract";
import resultPage from "../components/result-page";
import { getCurIdentity } from "@/util/common";

const steps = [
  {
    title: "关联订单"
  },
  {
    title: "核实商品"
  },
  {
    title: "预览并提交"
  }
];

export default {
  components: {
    tSteps,
    tOrder,
    vGoods,
    pContract,
    resultPage
  },
  data() {
    return {
      isKeepAlive: true,
      current: 0,
      previewData: {},
      imgFileList: [],
      datas: [],
      steps
    };
  },
  watch: {},
  created() {},
  computed: {
    identity() {
      return getCurIdentity(); //1买家，2卖家
    }
  },
  methods: {
    onStepChange(val, callback, imgFileList) {
      this.current = val;
      if (callback) {
        this.datas = callback;
      } else if (imgFileList) {
        this.imgFileList = callback;
      } else if (val == 0) {
        this.isKeepAlive = false;
      } else if (val == 1) {
        this.isKeepAlive = true;
      }
    }
  },
  beforeDestroy() {
    this.$storage.s_remove("createContractparams");
    this.$storage.s_remove("createContractOrder");
  }
};
</script>

<style lang="scss" scoped>
.generate-contract {
  background: #fff;
  .step {
    padding: 50px;
  }
}
</style>
